<!--  -->
<template>
  <base-breadcrumb>
    <a-spin :spinning="spinning">
      <a-row :gutter="10">
        <a-col :span="24">
          <a-card class="requiredFormItem">
            <title-name title="基本信息" />
            <custom-form
              ref="formBase"
              :editModel="''"
              :is-validate="true"
              :rules="rules"
              :form="form"
              :form-list="formOption"
              @change="handleChange"
            ></custom-form>
          </a-card>
        </a-col>
        <a-col :span="24">
          <component
            v-if="showComponent"
            :key="componentName"
            :is="componentName"
            ref="component"
            :base-form-info="form"
            :spinning.sync="spinning"
            @setPerProjectAddress="setPerProjectAddress"
          ></component>
        </a-col>
      </a-row>
      <div class="tool-btns page-btn-right-top">
        <template v-if="pageType !== 'detail'">
          <a-button
            class="ml20"
            :loading="loading"
            type="primary"
            @click="sumbit('SaveDrafts')"
          > 保存草稿 </a-button>
          <a-button
            class="ml20"
            :loading="loading"
            type="primary"
            @click="sumbit('Submit')"
          > 提交 </a-button>
        </template>
        <a-button
          class="ml20"
          type="primary"
          @click="$close()"
        > 关闭 </a-button>
      </div>
    </a-spin>
  </base-breadcrumb>
</template>

<script>
const allComponents = require.context('./components', false, /.*\.vue$/)
let res_components = {}
allComponents.keys().forEach((fileName) => {
  let comp = allComponents(fileName)
  res_components[fileName.replace(/^\.\/(.*)\.\w+$/, '$1')] = comp.default
})

import mixins from './mixins'
import { getPlanTaskBaseInfo } from '@/api/projectManagementPlanning/projectPlanningTaskList'

export default {
  name: 'projectManagementPlanningComponents',
  mixins: [mixins],
  data() {
    return {
      loading: false,
      spinning: false,
      form: {},
      formOption: [
        {
          label: '项目名称',
          keyName: 'projectName',
          type: 'BaseInput',
          disabled: true
        },
        {
          label: '项目编号',
          keyName: 'projectCode',
          type: 'BaseInput',
          disabled: true
        },
        {
          label: '策划项目',
          keyName: 'planProject',
          type: 'BaseInput',
          disabled: true
        },
        {
          label: '责任部门/责任人',
          keyName: 'duty',
          type: 'BaseInput',
          disabled: true
        },
        {
          label: '完成期限',
          keyName: 'deadline',
          type: 'BaseInput',
          disabled: true
        },
        {
          label: '操作人',
          keyName: 'projectOperatorName',
          type: 'BaseInput',
          disabled: true
        },
        {
          label: '创建时间',
          keyName: 'createTime',
          type: 'BaseInput',
          disabled: true
        }
      ],
      rules: {},
      pageType: '',
      showComponent: false
    }
  },

  components: res_components,

  watch: {
    '$route.name'(toPath, fromPath){
      console.log('路由变化了')
      if(toPath == 'projectManagementPlanningComponents') {
        const { id, pageType, pageName, version = 0 } = this.$route.query
        this.pageType = pageType
        this.componentName = pageName
        this.getPlanTaskBaseInfo()
        this.$nextTick(() => {
          this.showComponent = true
        })
      }else {
        this.showComponent = false
        this.form = {}
        this.spinning = false
      }
    },
  },

  computed: {},

  created() {
    const { id, pageType, pageName, version = 0 } = this.$route.query
    this.componentName = pageName
    this.pageType = pageType
    this.getPlanTaskBaseInfo()
    this.$nextTick(() => {
      this.showComponent = true
    })
  },

  mounted() {
    this.$store.commit('tabInfo/ADD_CACHE_PAGE', 'projectManagementPlanningComponents')
  },

  methods: {
    setPerProjectAddress(data) {
      if (data) {
        this.form.projectAddress = data
      }
    },
    getPlanTaskBaseInfo() {
      const { id, version, pageType } = this.$route.query
      const query = {
        planTaskDetailId: id
      }
      if (version) {
        query.latestData = false
        query.version = Number(version)
      } else {
        query.latestData = true
      }
      this.spinning = true
      getPlanTaskBaseInfo(query)
        .then((res) => {
          this.spinning = false
          this.form = res.data
          // 变更时取当前时间
          if (pageType === 'change') {
            this.form.createTime = this.moment().format('YYYY.MM.DD')
          }
        })
        .catch(() => {
          this.spinning = false
        })
    },
    handleChange() {},
    sumbit(type = 'Submit') {
      this.$refs.formBase.validate((valid) => {
        if (valid) {
          this.emitComponentSubmit(type)
        }else {
          this.$message.warning("请填写完所有必填项信息")
        }
      })
    }
  }
}
</script>
<style lang='less' scoped>
</style>
